import React from 'react';
import { Link } from 'umi';
import Authorized from './index';

/**
 * 带权限控制的链接组件
 * 当用户没有指定权限时，链接将被禁用或隐藏
 * @param {string} permission - 权限标识符
 * @param {boolean} hideWhenNoPermission - 无权限时是否隐藏链接，默认为false（禁用链接）
 * @param {object} props - 链接属性
 */
const AuthorizedLink = ({
  permission,
  hideWhenNoPermission = false,
  children,
  ...props
}) => {
  // 无权限时显示的内容
  const noMatch = hideWhenNoPermission ? null : (
    <span className="disabled-link" style={{ color: '#ccc', cursor: 'not-allowed' }}>
      {children}
    </span>
  );

  return (
    <Authorized
      permission={permission}
      noMatch={noMatch}
    >
      <Link {...props}>{children}</Link>
    </Authorized>
  );
};

export default AuthorizedLink;